<template>
  <el-card>
    <template #header>
      <div class="header-container">
        <span class="header-title">ZUTF</span>
        <el-tag type="warning" v-if="isModeError" class="header-message">
          模式设置错误
        </el-tag>
      </div>
    </template>
    <!-- <div>ZUTF</div> -->
    <el-form label-width="100px">
      <el-form-item label="运行方向">
        <el-radio-group v-model="AMANStore.inputs.ZUTF.direction">
          <el-radio value="N">向北</el-radio>
          <el-radio value="S">向南</el-radio>
        </el-radio-group>
      </el-form-item>

      <el-form-item :label="runwayNames.west + '跑道用途'">
        <el-checkbox-group v-model="AMANStore.inputs.ZUTF.usages.westRunway">
          <el-checkbox label="D">起飞</el-checkbox>
          <el-checkbox label="A">落地</el-checkbox>
        </el-checkbox-group>
      </el-form-item>

      <el-form-item :label="runwayNames.east + '跑道用途'">
        <el-checkbox-group v-model="AMANStore.inputs.ZUTF.usages.eastRunway">
          <el-checkbox label="D">起飞</el-checkbox>
          <el-checkbox label="A">落地</el-checkbox>
        </el-checkbox-group>
      </el-form-item>
      <el-form-item :label="runwayNames.north + '跑道用途'">
        <el-checkbox-group v-model="AMANStore.inputs.ZUTF.usages.northRunway">
          <el-checkbox label="D">起飞</el-checkbox>
          <el-checkbox label="A" disabled>落地</el-checkbox>
        </el-checkbox-group>
      </el-form-item>

      <el-form-item
        :label="isSingleQ ? singleQRunway + '跑道起飞' : '起飞忽略'"
      >
        <el-slider
          v-model="AMANStore.inputs.ZUTF.departure"
          :min="0"
          :max="isSingleQ ? 33 : 0"
          style="width: 200px; margin-left: 3px"
          :disabled="!isSingleQ"
        />
      </el-form-item>

      <el-form-item label="时间粒度">
        <el-slider
          v-model="AMANStore.inputs.ZUTF.timeSpan"
          :min="20"
          :max="60"
          :step="10"
          :marks="timeSpanMarks"
          show-stops
          style="width: 200px; margin-left: 3px"
        />
      </el-form-item>

      <el-divider />

      <el-form-item label="模式代码">
        <span class="text-modecode">
          {{ isModeError ? "--X--X--" : modeCode }}
        </span>
      </el-form-item>

      <el-form-item label="匹配N值">
        <span>
          <span class="text-nvalue">
            {{ isModeError ? "XX" : matchedItemCapacity }}
          </span>
          <span class="text-nunit"
            >&nbsp;/&nbsp;{{ AMANStore.inputs.ZUTF.timeSpan }}min</span
          >
        </span>
      </el-form-item>
    </el-form>
  </el-card>
</template>

<script setup>
import { ref, computed } from "vue";
import useAMANStore from "@/store/aman.js";
const AMANStore = useAMANStore();
const runwayNames = computed(() => {
  return {
    west: AMANStore.inputs.ZUTF.direction == "N" ? "01" : "19",
    east: AMANStore.inputs.ZUTF.direction == "N" ? "02" : "20",
    north: "11",
  };
});
const modeCode = computed(() => {
  let w = "";
  let e = "";
  let n = "";
  if (AMANStore.inputs.ZUTF.direction == "N") {
    if (AMANStore.inputs.ZUTF.usages.westRunway.length == 0) {
      w = "";
    } else if (AMANStore.inputs.ZUTF.usages.westRunway.length == 2) {
      w = "01Q";
    } else if (AMANStore.inputs.ZUTF.usages.westRunway[0] == "A") {
      w = "01A";
    } else if (AMANStore.inputs.ZUTF.usages.westRunway[0] == "D") {
      w = "01D";
    }
    if (AMANStore.inputs.ZUTF.usages.eastRunway.length == 0) {
      e = "";
    } else if (AMANStore.inputs.ZUTF.usages.eastRunway.length == 2) {
      e = "02Q";
    } else if (AMANStore.inputs.ZUTF.usages.eastRunway[0] == "A") {
      e = "02A";
    } else if (AMANStore.inputs.ZUTF.usages.eastRunway[0] == "D") {
      e = "02D";
    }
    if (AMANStore.inputs.ZUTF.usages.northRunway.length == 1) {
      n = "11";
    } else {
      n = "";
    }
  } else if (AMANStore.inputs.ZUTF.direction == "S") {
    if (AMANStore.inputs.ZUTF.usages.westRunway.length == 0) {
      w = "";
    } else if (AMANStore.inputs.ZUTF.usages.westRunway.length == 2) {
      w = "19Q";
    } else if (AMANStore.inputs.ZUTF.usages.westRunway[0] == "A") {
      w = "19A";
    } else if (AMANStore.inputs.ZUTF.usages.westRunway[0] == "D") {
      w = "19D";
    }
    if (AMANStore.inputs.ZUTF.usages.eastRunway.length == 0) {
      e = "";
    } else if (AMANStore.inputs.ZUTF.usages.eastRunway.length == 2) {
      e = "20Q";
    } else if (AMANStore.inputs.ZUTF.usages.eastRunway[0] == "A") {
      e = "20A";
    } else if (AMANStore.inputs.ZUTF.usages.eastRunway[0] == "D") {
      e = "20D";
    }
    if (AMANStore.inputs.ZUTF.usages.northRunway.length == 1) {
      n = "11";
    } else {
      n = "";
    }
  }
  return w + e + n;
});

const matchedItem = computed(() => {
  if (!AMANStore.schemes.ZUTF) {
    return null;
  }
  let matchedList = AMANStore.schemes.ZUTF.filter(
    (scheme) => scheme.modeCode == modeCode.value
  );
  if (matchedList.length > 0) {
    return matchedList[0];
  } else {
    return null;
  }
});

const matchedItemCapacity = computed(() => {
  if (matchedItem.value) {
    if (isSingleQ.value) {
      return singleQCapacity.value;
    } else {
      return Math.floor(
        (matchedItem.value.arrivalCapacity * AMANStore.inputs.ZUTF.timeSpan) /
          60
      );
    }
  } else {
    return "XX";
  }
});

const isModeError = computed(
  () => !matchedItem.value || matchedItem.value.length == 0
);

const isSingleQ = computed(
  () =>
    !isModeError.value &&
    ((AMANStore.inputs.ZUTF.usages.westRunway.length == 2 &&
      !AMANStore.inputs.ZUTF.usages.eastRunway.includes("A")) ||
      (AMANStore.inputs.ZUTF.usages.eastRunway.length == 2 &&
        !AMANStore.inputs.ZUTF.usages.westRunway.includes("A")))
);

const singleQRunway = computed(() =>
  isModeError.value
    ? ""
    : AMANStore.inputs.ZUTF.usages.westRunway.length == 2 &&
      !AMANStore.inputs.ZUTF.usages.eastRunway.includes("A")
    ? AMANStore.inputs.ZUTF.direction == "N"
      ? "01"
      : "19"
    : AMANStore.inputs.ZUTF.usages.eastRunway.length == 2 &&
      !AMANStore.inputs.ZUTF.usages.westRunway.includes("A")
    ? AMANStore.inputs.ZUTF.direction == "N"
      ? "02"
      : "20"
    : ""
);

const singleQCapacity = computed(() => {
  if (!isSingleQ.value) {
    return 0;
  }
  if (!AMANStore.schemes.ZUTFSingle) {
    return 0;
  }
  let matchList = AMANStore.schemes.ZUTFSingle.filter(
    (scheme) => scheme.departure == AMANStore.inputs.ZUTF.departure
  );
  if (matchList.length > 0) {
    return Math.floor(
      (matchList[0].arrival * AMANStore.inputs.ZUTF.timeSpan) / 60
    );
  }
  return 0;
});

const timeSpanMarks = ref({
  30: {
    label: "30min",
    style: { fontSize: "10px", marginTop: "6px" },
  },
  40: {
    label: "40min",
    style: { fontSize: "10px", marginTop: "6px" },
  },
  60: {
    label: "60min",
    style: { fontSize: "10px", marginTop: "6px" },
  },
});
</script>

<style scoped>
.text-nvalue {
  font-family: "Consolas", sans-serif, monospace;
  font-size: 36px;
  font-weight: bold;
}
.text-nunit {
  font-family: "Consolas", sans-serif, monospace;
  font-size: 18px;
  font-weight: bold;
}
.text-modecode {
  font-family: "Consolas", sans-serif, monospace;
  font-size: 24px;
  font-weight: bold;
}

.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header-title {
  font-size: 18px;
  font-weight: bold;
}

.header-messgae {
  font-size: 16px;
  font-weight: bold;
  color: var(--el-color-warning);
}
</style>
